<!-- 隐患工单 -->
<template>
	<view class="page">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block style="color: #777777;font-size: 32rpx;" slot="content">隐患工单</block>
		</cu-custom>

		<view class="input2">
			<view class="fkms_label">隐患名称</view>
			<input v-model="hiddenDanger.name" class="fkms" maxlength="-1" required="required"></input>
		</view>
		
		<view class="input2">
			<view class="fkms_label">隐患地点</view>
			<input v-model="hiddenDanger.address" class="fkms" maxlength="-1" required="required"></input>
		</view>

		<view class="input2">
			<view class="fkms_label">隐患描述</view>
			<input v-model="hiddenDanger.remark" class="fkms" maxlength="-1" required="required"></input>
		</view>

		<view class="padding flex flex-direction my-position">
			<button class="cu-btn margin-tb-sm lg my-btn" @click="submit">确认提交</button>
		</view>
		<u-toast ref="uToast"></u-toast>
		<message />
	</view>
</template>

<script>

	export default {
		onLoad(option) {
			this.ucId = option.ucId
			this.imgUrl = option.imgUrl
		},
		data() {
			return {
				hiddenDanger: {},
				ucId: '',
				imgUrl: '',
			}
		},
		methods: {
			submit() {
				if (!this.hiddenDanger.name) {
					this.$refs.uToast.show({
						message: "请输入隐患名称",
						type: 'error'
					})
					return
				}
				if (!this.hiddenDanger.address) {
					this.$refs.uToast.show({
						message: "请输入隐患地点",
						type: 'error'
					})
					return
				}
				if (!this.hiddenDanger.remark) {
					this.$refs.uToast.show({
						message: "请输入隐患描述",
						type: 'error'
					})
					return
				}
				let that = this
				this.hiddenDanger.taskId = this.ucId
				this.hiddenDanger.abnormalPic = this.imgUrl
				let app = getApp()
				app.globalData.request({
					url: 'wx/inHiddenDanger/addInHiddenDanger',
					data: this.hiddenDanger
				}).then(function(res) {
					that.$refs.uToast.show({
						message: "隐患工单创建成功",
						type: 'success',
						complete() {
							uni.navigateBack({
								delta: 1
							})
						}
					})
				}).catch(function(e) {})
			},
		}
	}
</script>

<style scoped>
	.page {
		width: 100vw;
	}

	.input1 {
		display: flex;
	}

	.input1 input {
		width: 80%;
		height: 30rpx;
		margin: 20rpx 0 0 10rpx;
		background: #FFFFFF;
		box-shadow: 0 0 4px 0 rgba(143, 143, 143, 0.50);
		border-radius: 8rpx;
		padding: 2rpx 4rpx;
	}

	.input2 {
		display: flex;
	}

	.fkms_label {
		font-size: 24rpx;
		color: #999999;
		margin: 20rpx 20rpx;
	}

	.fkms {
		width: 80%;
		margin: 20rpx 0 0 10rpx;
		background: #FFFFFF;
		box-shadow: 0 0 4px 0 rgba(143, 143, 143, 0.50);
		border-radius: 2rpx;
		outline: none;
		padding: 2rpx 4rpx;
	}

	.my-position {
		/* 		width: 100%;
		position:absolute;
		bottom: 220rpx; */
	}

	.my-btn {
		height: 94rpx;
		background-image: linear-gradient(90deg, #FAB53A 4%, #EFA21A 99%);
		box-shadow: 0 0 12px 0 rgba(250, 181, 58, 0.50);
		border-radius: 24px;
		font-family: PingFangSC-Medium;
		color: #FFFFFF;
	}
	
	
</style>
